Vue.component('xhfooter',{
    template:(function () {
        return `<div>
            <div class="bg_ff mt30">
        <ul class="layui-container no_pad split_column">
           <li>
               <img src="images/icon_duo.png" class="icon" alt="">&nbsp;&nbsp;百万号码&nbsp;&nbsp;&nbsp;谁与争锋
           </li>
            <li>
                <img src="images/icon_duo.png" class="icon" alt="">&nbsp;&nbsp;百万号码&nbsp;&nbsp;&nbsp;谁与争锋
            </li>
            <li>
                <img src="images/icon_duo.png" class="icon" alt="">&nbsp;&nbsp;百万号码&nbsp;&nbsp;&nbsp;谁与争锋
            </li>
            <li>
                <img src="images/icon_duo.png" class="icon" alt="">&nbsp;&nbsp;百万号码&nbsp;&nbsp;&nbsp;谁与争锋
            </li>
        </ul>
    </div>
    <footer class="layui-container no_pad">
        <div class="layui-row foot_box">
            <div class="layui-col-sm5">
                <ul class="foot_nav">
                    <li>
                        <a href="about.html?type=1" class="foot_head">关于我们</a>
                        <a href="about.html?type=1">关于我们</a>
                        <a href="about.html?type=2">发展历程</a>
                        <a href="about.html?type=3">商务合作</a>
                    </li>
                    <li>
                        <a href="about.html?type=4" class="foot_head">购物指南</a>
                        <a href="about.html?type=4">套餐导购</a>
                        <a href="about.html?type=5">选号流程</a>
                        <a href="about.html?type=6">用户协议</a>
                    </li>
                    <li>
                        <a href="about.html?type=7" class="foot_head">服务保障</a>
                        <a href="about.html?type=7">交易方式</a>
                        <a href="about.html?type=8">退货政策</a>
                        <a href="about.html?type=9">意见反馈</a>
                    </li>
                    <li>
                        <a href="about.html?type=10" class="foot_head">客服中心</a>
                        <a href="about.html?type=10">移动客服</a>
                        <a href="about.html?type=11">联通客服</a>
                        <a href="about.html?type=12">电信客服</a>
                    </li>
                </ul>
            </div>
            <div class="layui-col-sm7  disFlex server_box" style="display: flex;">
                <div class="line"></div>
                <div>
                    <img src="images/ewm.png" alt="">
                    <h1 class="server_h1">中国联通授权代理</h1>
                    <p>扫描二维码查看</p>
                </div>
                <div>
                    <img src="images/ewm.png" alt="">
                    <h1 class="server_h1">中国移动授权代理</h1>
                    <p>扫描二维码查看</p>
                </div>
                <div>
                    <img src="images/ewm.png" alt="">
                    <h1 class="server_h1">中国电信授权代理</h1>
                    <p>扫描二维码查看</p>
                </div>
                <div class="line"></div>
                <div>
                    <img src="images/ewm.png" alt="">
                    <p>扫描上方二维码</p>
                    <p>关注微信公众号</p>
                </div>
            </div>
        </div>
    </footer>
    <div class="copyRight">
        Copyright 2018 蜀ICP备18024397号 四川牛卡商贸有限公司
    </div>
</div> `
    })(),
    data:function () {
        return {

        }
    },
    methods:{

    }
})
Vue.component('xhhead',{
    template:(function () {
        return `<div>
    <header class="bg_head">
        <div class="layui-container disFlex">
           <div class="aside">
               <img src="images/logo.png" alt="logo" class="logo">
           </div>
            <ul class="disFlex head_nav">
                <li v-for="(a,i) in headNav" :class="{on:on==i}" @click="headBtn(i)">{{a.item}}</li>
            </ul>
             <div :class="{user:true,login:is_login}" >
                <template v-if="is_login">
                     <span @click="loginBtn(1)">登陆</span><span @click="loginBtn(2)">注册</span>
                 </template>
                 <template v-if="!is_login">
                     <img src="images/user.png" class="icon_user" alt=""> 个人中心
                     <div class="sub_menu">
                         <div class="sub_mit">
                             18080153573
                             <p>积分：3500</p>
                         </div>
                         <ul>
                             <li @click="go_user(0)">我的订单</li>
                             <li @click="go_user(1)">修改密码</li>
                             <li @click="go_user(2)">入网资料管理</li>
                             <li @click="go_user(3)">收获地址管理</li>
                         </ul>
                         <div class="login_out">
                             退出登陆
                         </div>
                     </div>
                 </template>
             </div>
        </div>
    </header>
</div>`
    })(),
    data:function () {
        return {
            loginIf:false,
            loginType:1,
            headNav:[{item:"移动选号"},{item:"电信选号"},{item:"联通选号"},{item:"虚拟运营商选号"},{item:"座机选号"}],
            is_login:true,//是否需要登陆
        }
    },
    methods:{
        loginBtn:function(i){ this.$emit("login",i);console.log("type",i) },
        closeLogin:function (data) {this.loginIf=data; },
        headBtn:function (i) {this.on=i;sessionStorage.header=i;location.href="index.html";},
        go_user:function(i){location.href="user_order.html?type="+i}
    },
    props:["on"],
    created:function(){
        this.on=sessionStorage.header?sessionStorage.header:0
    }
})
function urlParams() {
    var data={};
    var params=location.href.split("?")[1];
    if(params){
        var paramsList=params.split("&");
        paramsList.map(function (value) {
            var item=value.split("=");
            data[item[0]]=item[1]
        })
    }
    return data;
}